<script setup>
  import { useRouter, useRoute } from "vue-router"
  import { ref } from 'vue'

  const router = useRouter()
  const route = useRoute()

  const goMyinfo = () => {
    router.push('/myInfo')
  }
</script>

<template>
  <div class="my">
    <div class="userinfo">
      <van-image
        round
        width="1.8rem"
        height="1.8rem"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
      <div class="info-txt">
        <div class="name">飞翔的企鹅</div>
        <div class="introduce">这是我的个人介绍啦啦啦啦啦啦</div>
      </div>
    </div>
    <div class="clockIn">
      <div class="clock_fine" v-if="true">
        <h5>每日签到</h5>
        <img src="../../assets/imgs/my/checkin.png" alt="">
      </div>
      <div class="clock_not" v-else>今日签到 99 天</div>
    </div>
    <div class="userfeature" >
      <van-cell title="我的信息" is-link @click="goMyinfo"/>
      <van-cell title="我的发布" is-link/>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.my {
  width: 100%;
  .userinfo {
    padding: 0 0.5rem;
    padding-top: 1.6rem;
    display: flex;
    width: 100%;
    height: 3.8rem;
    background-color: #fedd2b;
    .info-txt {
      margin-left: 0.4688rem;
      padding-top: 0.25rem;
      .name {
        font-size: 0.4688rem;
        font-weight: 700;
      }
      .introduce {
        font-size: 0.375rem;
        // color: ;
      }
    }
  }
  .userfeature {
    margin: .375rem;
    border-radius: .3125rem;
    overflow: hidden;
    // margin-top: 1rem;
  }
  .noLogin {
    margin-top: 3rem;
    .title {
      font-size: 1rem;
      text-align: center;
    }
    .register-txt {
      padding-right: 0.4688rem;
      font-size: 0.42rem;
      text-align: right;
    }
  }
  .clockIn {
    .clock_fine {
      margin-top: .8125rem;
      width: 100%;
      text-align: center;
      h5 {
        font-size: .5625rem;
      }

      img {
        width: 2.5rem;
        height: 2.5rem;
      }
    }
  }
}
</style>
